<template>
  <el-dialog title="转派" :visible.sync="show" :close-on-click-modal="false" :show-close="!btnLoading" width="500px" @closed="closed">
    <el-form ref="form" :model="form" :rules="rules">
      <el-form-item prop="projectId" class="hide" />
      <el-form-item prop="patTaskId" class="hide" />
      <el-form-item prop="principalId">
        <el-select v-model="form.principalId" placeholder="请选择转派的负责人" filterable clearable :loading="principalLoading" style="width: 100%">
          <el-option v-for="item in principalList" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
    </el-form>
    <div slot="footer">
      <el-button type="primary" :loading="btnLoading" @click="btnSubmit">确 定</el-button>
      <el-button :disabled="btnLoading" @click="show = false">取 消</el-button>
    </div>
  </el-dialog>
</template>
<script>
// 任务转派
import { editFormMixin } from '@/utils/mixin'
import { taskTurnSend, getSpotBuilder } from '@/api/cq/patrol'
export default {
  mixins: [editFormMixin],
  data() {
    return {
      primaryKey: 'patTaskId',
      updateApi: taskTurnSend,
      form: {
        projectId: '',
        patTaskId: '',
        principalId: ''
      },
      rules: {
        principalId: [{ required: true, message: '请选择转派的负责人' }]
      },
      principalLoading: false,
      principalList: []
    }
  },
  methods: {
    closed() {
      this.$refs.form.resetFields()
      this.principalList = []
    },
    async opened(item = {}) {
      this.getPrincipalList()
    },
    async getPrincipalList() {
      const { projectId } = this.form
      if (!projectId) return

      const opt = { projectId }
      this.principalLoading = true
      const res = await getSpotBuilder(opt).catch(() => false)
      this.principalLoading = false
      if (res === false) return
      this.principalList = res.data || []
    }
  }
}
</script>
